import React from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Card, Alert, Typography } from 'antd';
import { useIntl, FormattedMessage } from 'umi';
import styles from './Welcome.less';

const CodePreview: React.FC = ({ children }) => (
  <pre className={styles.pre}>
    <code>
      <Typography.Text copyable>{children}</Typography.Text>
    </code>
  </pre>
);

import { Popover, Button, message } from 'antd';

const content = (
  <div>
    <p>Content</p>
    <p>Content</p>
  </div>
);




export default (): React.ReactNode => {
  const intl = useIntl();
  function handleClick(e) {
    e.preventDefault();
    console.log('The link was clicked.');
    message.info('This is a normal message');
  }
  return (
    <PageContainer>
      <Card>
        <CodePreview>sdfsdfsdf</CodePreview>
        asdasdasd
        <Button type="primary" onClick={handleClick}>Primary Button</Button>
      </Card>
      <Popover content={content} title="Title">
        <Button type="primary">Hover me</Button>
      </Popover>
    </PageContainer>
  );
};
